import { setItem } from './storage'
/**
 *
 * @param {String} el 选择器
 * @param {*} option 配置对象 { lineNum:干扰线数量 ,textLen:验证码长度 ,width:画布宽 ,height:画布高 }
 */
function Gcode (el, option) {
  this.el = typeof el === 'string' ? document.querySelector(el) : el

  this.option = option || {}

  this.text = ''

  this.init()
}

Gcode.prototype = {

  constructor: Gcode,

  init: function () {
    if (this.el.getContext) {
      var ctx = this.el.getContext('2d')

      // 设置画布宽高

      var cw = this.el.width = this.option.width || 90

      var ch = this.el.height = this.option.height || 30

      var textLen = this.option.textLen || 4

      var lineNum = this.option.lineNum || 2

      this.randomText(textLen)

      this.onClick(ctx, textLen, lineNum, cw, ch)

      this.drawLine(ctx, lineNum, cw, ch)

      this.drawText(ctx, this.text, ch)
    }
  },

  onClick: function (ctx, textLen, lineNum, cw, ch) {
    var _ = this

    this.el.addEventListener('click', function () {
      _.randomText(textLen)

      _.drawLine(ctx, lineNum, cw, ch)

      _.drawText(ctx, _.text, ch)
    }, false)
  },

  // 画干扰线

  drawLine: function (ctx, lineNum, maxW, maxH) {
    ctx.clearRect(0, 0, maxW, maxH)

    for (var i = 0; i < lineNum; i++) {
      var dx1 = Math.random() * maxW

      var dy1 = Math.random() * maxH

      var dx2 = Math.random() * maxW

      var dy2 = Math.random() * maxH

      ctx.strokeStyle = ' rgb(' + 255 * Math.random() + ',' + 255 * Math.random() + ',' + 255 * Math.random() + ')'

      ctx.beginPath()

      ctx.moveTo(dx1, dy1)

      ctx.lineTo(dx2, dy2)

      ctx.stroke()
    }
  },

  // 画文字

  drawText: function (ctx, text, maxH) {
    var len = text.length

    for (var i = 0; i < len; i++) {
      var dx = 20 * Math.random() + 20 * i

      var dy = Math.random() * 5 + maxH / 2

      ctx.fillStyle = ' rgb(' + 255 * Math.random() + ',' + 255 * Math.random() + ',' + 255 * Math.random() + ')'

      ctx.font = ' 22px Helvetica'

      ctx.textBaseline = ' middle'

      ctx.fillText(text[i], dx, dy)
    }
  },

  // 生成指定个数的随机文字

  randomText: function (len) {
    var source = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z']

    var result = []

    var sourceLen = source.length

    for (var i = 0; i < len; i++) {
      var text = this.generateUniqueText(source, result, sourceLen)

      result.push(text)
    }
    this.text = result.join('')
    setItem('verify_code', this.text)
  },

  // 生成唯一文字

  generateUniqueText: function (source, hasList, limit) {
    var text = source[Math.floor(Math.random() * limit)]

    if (hasList.indexOf(text) > -1) {
      return this.generateUniqueText(source, hasList, limit)
    } else {
      return text
    }
  }

}

export default Gcode
